<div>
    <div class="problem-body">
        <div class="nb">
            <div class="problem-lside">
                <!-- <h3>个人中心</h3> -->
                <ul>
                    <li>
                        <a href="javascript:void(0);
    " class="nli">个人中心<b class="arrow"></b></a>
                        <ul class="ulson" style="display: block;">
                            <li><a href="#">订单管理</a></li>
                            <!--                            <li><a href="/pageLR.html#/pages/plateform/cart">购物车</a></li>-->
                            <li><a href="/page.html#/pages/plateform/address">收货地址</a></li>
                            <li><a href="/page.html#/pages/plateform/personalInfo">个人信息</a></li>
                        </ul>
                    </li>
                    <!-- <li>
                        <a href="javascript:void(0);
    " class="nli">账户和会员<b class="arrow"></b></a>
                        <ul class="ulson" style="display: block;">
                            <li><a href="n-point.html">积分规则</a></li>

                        </ul>
                    </li> -->
                </ul>
            </div>

            <div class="problem-rside">
                <div class="probar">
                    <a href="#">个人中心-订单列表</a>
                </div>
                <div class="problemcon problistpad">
                    <div class="goods-table">
                        <div class="goods-thead">
                            <div class="col col2">
                                商品信息
                            </div>
                            <div class="col col4">
                                单价
                            </div>
                            <div class="col col4">
                                数量
                            </div>
                            <div class="col col4">
                                实付款
                            </div>
                            <div class="col col6">
                                操作
                            </div>
                        </div>
                        <div class="goods-tbody">
                            <div v-for="(order, indexO) in orderInfo.orders" style="border-bottom: 1px solid #E4E4E4;">
                                <div style="margin-left: 20px;margin-top: 20px;">
                                    <div>
                                        订单时间：{{order.createTime}}
                                        订单编号 {{order.orderId}}
                                    </div>
                                </div>
                                <div>
                                    <div class="col col2 goods-title-pic" style="border: none;">
                                        <a :href="'/page.html#/pages/plateform/productDetail?productId=' + order.productId"><img
                                                :src="order.coverPhoto"
                                                width="60" height="60"></a>
                                        <div class="goods-describ elli" style="width: 80%;">
                                            <p>
                                                <a :href="'/page.html#/pages/plateform/productDetail?productId=' + order.productId">{{order.prodName}}</a>
                                            </p>
                                        </div>
                                    </div>
                                    <div class="col col4 goods-price" style="border: none;"> ￥{{order.price}}</div>
                                    <div class="col col4 good-num" style="border: none;"> {{order.cartNum}}</div>
                                    <div class="col col4 orange-bold xiaoji">
                                        ￥{{order.cartNum * order.price}}
                                    </div>
                                    <div class="col col6">
                                        <div v-if="order.state == 3104">
                                            <button @click="_closeOrder(order)"
                                                    style="font-size: 12px;line-height: 25px;padding: 0 20px;border-radius: 5px;background-color: #EAEAEA;width: 100px;">
                                                关闭订单
                                            </button>
                                        </div>
                                        <div v-if="order.state == 2002" style="margin-top: 5px;"><a
                                                href="javascript:void(0);">待发货</a></div>
                                        <div v-if="order.state == 2002" style="margin-top: 5px;">
                                            <button class="action-btn" @click="_expeditingDelivery(order)"
                                                    style="font-size: 12px;line-height: 25px;padding: 0 20px;border-radius: 5px;background-color: #EAEAEA;width: 100px;">
                                                催发货
                                            </button>
                                        </div>
                                        <div v-if="order.state == 3003" style="margin-top: 5px;">
                                            <button @click="_logisticOrder(order)"
                                                    style="font-size: 12px;line-height: 25px;padding: 0 20px;border-radius: 5px;background-color: #EAEAEA;width: 100px;">
                                                物流信息
                                            </button>
                                        </div>
                                        <div v-if="order.state == 3003" style="margin-top: 5px;">
                                            <button @click="_confirmOrder(order)"
                                                    style="font-size: 12px;line-height: 25px;padding: 0 20px;border-radius: 5px;background-color: #EAEAEA;width: 100px;">
                                                确认收货
                                            </button>
                                        </div>
                                        <div v-if="order.state == 4004" style="margin-top: 5px;">
                                            <button @click="_evaluateOrder(order)"
                                                    style="font-size: 12px;line-height: 25px;padding: 0 20px;border-radius: 5px;background-color: #EAEAEA;width: 100px;">
                                                立即评价
                                            </button>
                                        </div>
                                        <div v-if="order.state == 4004" style="margin-top: 5px;">
                                            <button @click="_toReturn(order)"
                                                    style="font-size: 12px;line-height: 25px;padding: 0 20px;border-radius: 5px;background-color: #EAEAEA;width: 100px;">
                                                退货
                                            </button>
                                        </div>
                                        <div v-if="order.state == 4004" style="margin-top: 5px;">
                                            <button @click="_logisticOrder(order)"
                                                    style="font-size: 12px;line-height: 25px;padding: 0 20px;border-radius: 5px;background-color: #EAEAEA;width: 100px;">
                                                物流信息
                                            </button>
                                        </div>
                                        <div v-if="order.state == 5005"><a href="javascript:void(0);">申请退款</a></div>
                                        <div v-if="order.state == 7017"><a href="javascript:void(0);">订单已关闭</div>
                                        <div v-if="order.state == 8008"><a href="javascript:void(0);">已完成</a></div>
                                    </div>
                                </div>
                                <div style="margin-left: 20px;margin-top: 20px;margin-bottom: 10px;">
                                    <div>
                                        订单总价：{{order.totalPrice}}&nbsp;&nbsp;
                                        收货人姓名：{{order.personName}}&nbsp;&nbsp;
                                        收货地址电话：{{order.address}}；{{order.tel}}
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="pages">
                        <vc:create path="frame/pagination"></vc:create>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="edit-address modbox" id="confirm" style="position: fixed; top: 30%; ">
        <div class="edit-box">
            <h3>收货确认提醒<i class="close-modbox" v-on:click="closeTips()"></i></h3>
            <div class="edit-form">
                <ul>
                    <li>
                        <label><i>*</i></label>
                        确认已经收到该订单内的所有物品，如已全部收到请点击“确定收货”，如很长时间未收到货品请联系平台。
                    </li>
                </ul>
                <ul style="text-align: center;margin-right: 60px;">
                    <button class="btn-save" id="saveconsignee" @click="_saveConfirmOrder();">确定收货</button>
                </ul>
            </div>
        </div>
    </div>

    <div class="edit-address modbox" id="evaluate" style="position: fixed; top: 30%; ">
        <div class="edit-box">
            <h3>评价<i class="close-modbox" v-on:click="closeTips()"></i></h3>
            <div class="edit-form">
                <ul>
                    <li style="clear: both;">
                        <label><i>*</i>评分：</label>
                        <select class="custom-select" v-model="appraiseScore" style="height: 35px;">
                            <option value="1">1星</option>
                            <option value="2">2星</option>
                            <option value="3">3星</option>
                            <option value="4">4星</option>
                            <option value="5">5星</option>
                        </select>
                    </li>
                    <li style="clear: both;">
                        <label><i>*</i>内容：</label>
                        <input type="text" id="sh-address" v-model="context" maxlength="50" class="l-length">
                    </li>
                </ul>
                <ul style="text-align: center;margin-right: 60px;">
                    <button class="btn-save" id="saveconsignee" @click="_saveEvaluate();">立即评价</button>
                </ul>
            </div>
        </div>
    </div>

    <div class="edit-address modbox" id="logistic" style="position: fixed; top: 30%; ">
        <div class="edit-box">
            <h3>物流信息<i class="close-modbox" v-on:click="closeTips()"></i></h3>
            <div class="edit-form">
                <ul>
                    <li>
                        <label><i>*</i></label>
                        物流公司：{{logistic.logisticOrgName}}
                    </li>
                    <li>
                        <label><i>*</i></label>
                        物流编号：{{logistic.logisticNum}}
                    </li>
                    <li>
                        <label><i>*</i></label>
                        备注：{{logistic.remark}}
                    </li>
                </ul>
                <ul style="text-align: center;margin-right: 60px;">
                    <button class="btn-save" id="saveconsignee" @click="closeTips();">确定</button>
                </ul>
            </div>
        </div>
    </div>

    <div class="edit-address modbox" id="return" style="position: fixed; top: 30%; ">
        <div class="edit-box">
            <h3>退货<i class="close-modbox" v-on:click="closeTips()"></i></h3>
            <div class="edit-form">
                <ul>
                    <li style="clear: both;">
                        <label><i>*</i>原因：</label>
                        <input type="text" id="sh-address" v-model="context" maxlength="30" class="l-length">
                    </li>
                </ul>
                <ul style="text-align: center;margin-right: 60px;">
                    <button class="btn-save" id="saveconsignee" @click="_saveReturn();">退货</button>
                </ul>
            </div>
        </div>
    </div>

    <div id="mask"></div>
</div>
